<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Vue importmap</title>
</head>
<body>
    

    <script type="importmap">
        {
          "imports": {
            "vue": "https://unpkg.com/vue@3/dist/vue.esm-browser.js"
          }
        }
      </script>
      
      <div id="app">
        {{ message }}  
        <my-component />
      </div>
      
      <script type="module">
        import { createApp, ref } from 'vue'
        import MyComponent from './my-component.js'
      
        createApp({
          setup() {
            const message = ref('Hello Vue!')
            console.log('kk message:', message)
            return {
              message
            }
          },
          components: { MyComponent }
        }).mount('#app')
      </script>
</body>
</html>